// 封装轮播图业务相关代码，易于维护
import { getBannerAPI } from "@/apis/home";
import { onMounted, ref } from "vue";
export function useBanner() {
  // 定义一个  响应式   的bannerList数组
  const bannerList = ref([]);

  // 异步请求数据
  const getBanner = async () => {
    const res = await getBannerAPI({
      distributionSite: "2",
    });
    // 通过ref所生成的响应式数据，赋值时一定要写.value
    bannerList.value = res.result;
  };

  // 在生命周期函数中调用接口
  onMounted(() => getBanner());

  return {
    bannerList,
  };
}
// 这种经过封装的业务逻辑，最后导出的都是经过自己处理的父组件需要的数据
